// Random rules that aren't yet categorized into other SCSS files
.hmdl-body {

    &:not(.hmdl-page) .mdl-card__supporting-text ~ .mdl-card__supporting-text {
        border-top: 1px solid rgba(0, 0, 0, 0.1);
    }

    .icon-button {
        min-width: 32px;
    }

    .material-icons {
        font-size: 1em;
        cursor: pointer;
    }

    .material-icons_lg {
        font-size: 1.33em;
        cursor: pointer;
    }

    .material-icons_2x {
        font-size: 2.0em;
        cursor: pointer;
    }

    .mdl-card {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        min-height: 360px;

        &>a {
            color: inherit;
            text-decoration: none;
            font-weight: inherit;
        }

        h3 {
            margin: 0;

            &.quote:after,
            &.quote:before {
                display: block;
                font-size: 3em;
                margin-top: 0.5em;
            }

            &.quote:after {
                content: '”';
            }

            &.quote:before {
                content: '“';
            }

            a {
                text-decoration: none;
            }
        }

        .meta.meta--fill {
            justify-content: space-between;
        }
    }

    .mdl-card__actions {
        display: flex;
        box-sizing: border-box;
        align-items: center;
        justify-content: space-between;

        &:first-child {
            margin-left: 0;
        }
    }

    .mdl-card__media {
        box-sizing: border-box;
        background-size: cover;
        padding: 24px;
        display: flex;
        flex-grow: 1;
        flex-direction: row;
        align-items: flex-end;
        cursor: pointer;

        & ~ .mdl-card__supporting-text {
            min-height: 64px;
        }

        a {
            color: inherit;
        }
    }

    .mdl-card__title {
        padding: 16px;
        flex-grow: 1;

        a {
            color: inherit;
        }
    }

    .mdl-layout__header,
    .mdl-layout__drawer-button,
    .mdl-layout__header--transparent .mdl-navigation__link {
        color: white;
    }

    .mdl-mini-footer {
        min-height: 80px;
        padding: 20px;
        align-items: center;
        background-color: white;
        box-sizing: border-box;

        @media (max-width: 480px) {
            flex-flow: column;
        }
    }

    .meta {
    }

    .pagination {
        display: flex;
        flex-direction: row;
        justify-content: space-around;
        align-items: center;
        padding: 8px;
        border-bottom: 1px solid #dcdcdc;

        .active {
            text-decoration: underline;
        }
        
        .disabled {
            color: rgba(0, 0, 0, 0.54);
        }

        .page-nums {
            padding-left: 8px;
            padding-right: 8px;
            text-decoration: none;

            &:hover {
                text-decoration: underline;
            }
        }
    }

    .project-card {
        min-height: 275px;

        .project-title a {
            font-size: 1.2em;
            line-height: 20px;
            text-decoration: none;
        }
    }
}
